import React from 'react';
import { Select } from 'antd';

// 常见波特率列表
const commonBaudrates = [
  300, 600, 1200, 2400, 4800, 9600, 14400, 19200, 38400, 57600, 115200, 230400,
  460800, 921600, 1000000,
];

interface SerialBaudRateSelectViewProps {
  value?: number;
  onChange?: (value: number) => void;
}

const options = commonBaudrates.map((rate) => ({
  value: rate,
  label: rate.toString(),
}));

const SerialBaudRateSelectView: React.FC<SerialBaudRateSelectViewProps> = ({
  value,
  onChange,
}) => (
  <Select
    showSearch
    placeholder="请选择波特率"
    value={value}
    onChange={onChange}
    className="baudrate-select"
    optionFilterProp="label"
    style={{ width: '100%' }}
    filterOption={(input, option) =>
      (option?.label as string).toLowerCase().includes(input.toLowerCase())
    }
    allowClear
    options={options}
  />
);

export default SerialBaudRateSelectView;
